<template>
	<view class="location_Go">
		<view class="location_Go_title">
			<span v-if="locationList===''">还没有收货地址</span>
			<view v-else class="location_info">

				<view @touchstart="touchS" @touchmove="touchM" @touchend="touchE"
					:style="{'left':act_touch==index?leftStyle + 'upx':0}" :data-index="index"
					class="location_xx container-1" v-for="(item,index) in locationList" @click="handleClick(item)">
					<view class="location_width">

						<view class="location_loca">
							{{item.provinceCityDistrict}}{{item.detail}}
						</view>
						<view class="location">
							<view class="location_name">
								{{item.realName}}
							</view>
							<view class="location_phone">
								{{item.phone}}
							</view>
						</view>
						<view class="location_dj">
							<view class="location_button2">
								<image @click.stop="ClickUpdate(item)" class="image2" src="../../static/3x/edit.png">
								</image>
							</view>
						</view>
					</view>
					<view class="delete-1" @click.stop="delData(item)">
						删除
					</view>
				</view>

			</view>
		</view>
		<!-- <image class="imgimg" src="../../static/3x/set.png"></image> -->
		<view class="uni-btn-v">
			<button type="primary" @click="AddLocation()">新增收货地址</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				locationList: [],
				option: {},
				leftStyle: 0,
				startX: 0,
				hiddenFlag: true,
				delBtnWidth: 220,
				act_touch: null,
			}
		},
		onLoad(option) {
			this.option = option
		},
		methods: {
			handleClick(row) {
				// localStorage.setItem("userSelect",row.id)
				uni.setStorageSync("userSelect", row.id)
				uni.navigateBack()
			},
			MRlocation(item) {
				this.$http({
					url: '/crmUserAddress/updDefault',
					data: {
						id: item.id,
						isDefault: item.isDefault
					}
				}).then(res => {
					if (res.data.code === 200) {
						uni.showToast({
							title: '设置成功'
						})
						this.WxLocation()
					}
				})
			},
			ClickUpdate(item) {
				uni.navigateTo({
					url: '/pages/updateLocation/updateLocation?id=' + item.id
				})
			},
			AddLocation() {
				uni.navigateTo({
					url: '/pages/location/location'
				})
			},
			WxLocation() {
				this.$http({
					url: '/crmUserAddress/selCrmUserAddress'
				}).then(res => {
					this.locationList = res.data.data
				})
			},
			// 开始移动时
			touchS({
				touches
			}) {
				// startX记录开始移动的位置
				if (touches.length === 1) {
					this.startX = touches[0].clientX;
				}
				// hiddenFlag为true则是从右向左，为false则是从左向右
				if (this.leftStyle === 0) {
					this.hiddenFlag = true;
				} else {
					this.hiddenFlag = false;
				}
			},
			touchM(e) {
				if (e.touches.length === 1) {
					//手指移动时水平方向位置
					const moveX = e.touches[0].clientX;
					this.moveFunc(moveX);
					//获取手指触摸的是哪一项
					// console.log(e.currentTarget.dataset.index)
					var index = e.currentTarget.dataset.index;
					this.act_touch = index;
				}
			},
			touchE({
				touches
			}) {
				const {
					leftStyle
				} = this;
				const {
					delBtnWidth
				} = this;
				// 如果停止滑动的距离大于二分之一则直接弹出删除按钮，不然则left为0
				if (-leftStyle > delBtnWidth / 2) {
					this.leftStyle = -delBtnWidth;
				} else {
					this.leftStyle = 0;
				}
			},
			moveFunc(moveX) {
				// 原始位置向左，leftStyle为小于0；原始位置向右，leftStyle为大于0
				// disX为相对最初位置的左右距离
				// 大于0为向右，小于0为向左
				const disX = moveX - this.startX;
				const delBtnWidth = this.delBtnWidth;
				let offsetNum = 0;
				if (-disX >= delBtnWidth && this.leftStyle === -delBtnWidth) {
					return;
				}
				// console.log(disX, this.hiddenFlag);
				// this.hiddenFlag为true则是从左到右，则应该将container向左移动
				// this.hiddenFlag为false则是从右向左，则应该将container向右移动
				if (this.hiddenFlag) {
					// 此时container为最右边，则应该将container向左移动
					// disX大于0为相对原始位置的向右移动，则直接将offsetNum置为0
					// 否则为向左移动，offsetNum为disX相反的值，判断是否超过设置的最大位置
					if (disX == 0 || disX > 0) {
						offsetNum = 0;
					} else {
						offsetNum = disX;
						if (disX <= -delBtnWidth) {
							//控制手指移动距离最大值为删除按钮的宽度
							offsetNum = -delBtnWidth;
						}
					}
				} else {
					// 此时container为最左边，应该向右移动
					// disX小于0为相对原始位置的向左移动，则直接将offsetNum置为-this.delBtnWidth
					// 否则为相对原始位置的向右移动，此时应该将最大位置与向右位置的差值为此刻位置，判断是否为大于0
					if (disX < 0) {
						offsetNum = -this.delBtnWidth;
					} else {
						offsetNum = -this.delBtnWidth + disX;
						if (offsetNum > 0) {
							offsetNum = 0;
						}
					}
				}
				this.leftStyle = offsetNum;
			},
			//删除方法
			delData(item) {
				this.$http({
					url: '/crmUserAddress/delCrmUserAddress',
					data: {
						id: item.id
					},
					method: 'POST'
				}).then(res => {
					if (res.data.code === 200) {
						uni.showToast({
							title: '删除成功'
						})
						uni.navigateTo({
							url: '/pages/locationGo/locationGo'
						})
					}
				});
			},

		},
		mounted() {
			this.WxLocation()
		},
		onShow() {
			this.WxLocation()
		}
	}
</script>

<style>
	@import './index.css'
</style>
